<template>
  <van-pull-refresh v-model="loading" @refresh="onRefresh">
    <all-skeleton :show="goodsList.length > 0 ? true : false" name="home_goods">
      <div class="goods">
        <div class="goodslist" v-if="goodsList">
          <div
            class="goodsitem"
            v-for="item in goodsList"
            :key="item.id"
            @click="toPage(item.id, type)"
          >
            <div class="goodsimage" v-if="setting">
              <img :src="setting.cloud.url + item.image" />
            </div>
            <div class="text">
              <div class="nameandissunumber">
                <div class="goodstitle">{{ item.name }}</div>
                <div class="issunum">
                  <div class="issu">发行</div>
                  <div class="number">{{ item.num }}</div>
                </div>
              </div>
              <div class="goodsprice">
                <span style="font-weight: lighter">售价:</span>
                <div style="font-size: 0.3rem">￥{{ item.price }}</div>
              </div>

              <!-- <div class="goodsprice issuername">
                <span style="font-weight: lighter; margin-top: 0.1923rem"
                  >发行方:</span
                >
                <div class="issuer">
                  <img :src="setting.cloud.url + item.avatar" alt="" />
                  <div class="name">{{ item.username }}</div>
                </div>
              </div> -->
            </div>
          </div>
        </div>
      </div>
    </all-skeleton>
  </van-pull-refresh>
</template>

<script setup >
import goodsStore from "../store/goods";
import commonStore from "../store/common";
import { ref, computed } from "vue";
import { useRouter } from "vue-router";

// 获取setting数据
const common = commonStore();
let setting = computed(() => common.setting);

// 获取商品列表
let goodsList = ref([]);
const goods = goodsStore();

const getGoodsList = () => {
  goods.homeGoodsList().then((res) => {
    goodsList.value = res;
    console.log("商品列表:", res)
    loading.value = false
  });
};

// 跳转到详情页
const router = useRouter();
const toPage = (id) => {
  router.push({ name: "goodsDetails", params: { id: id } });
};

// 下拉刷新
const loading = ref(false)
const onRefresh = () => { 
  loading.value = true
  goodsList.value = [] 
  getGoodsList()
}

const onLoad = () => {
  getGoodsList();
};

onLoad();
</script>

<style lang="scss" scoped>
</style>